<template>
  <div>
    <el-table
      :data="list"
      :highlight-current-row="true"
      :max-height="1500"
      :size="size"
      v-loading="loading"
      style="width: 100%"
    >
      <el-table-column
        v-loading="loading"
        align="center"
        label="活动ID"
        width="300"
        element-loading-text="请给我点时间！"
      >
        <template slot-scope="scope">
          <span>{{ scope.row.groupCode }}</span>
        </template>
      </el-table-column>

      <el-table-column  align="center" label="拼团活动名称" width="240">
        <template slot-scope="scope">
          <span>{{ scope.row.promName}}</span>
        </template>
      </el-table-column>

      <el-table-column  align="center" label="拼团人数" width="100">
        <template slot-scope="scope">
          <span>{{ scope.row.groupMembers}}</span>
        </template>
      </el-table-column>

      <el-table-column width="110px" align="center" label="活动渠道">
       <template slot-scope="scope">
         <span>{{scope.row.channelCodess}}</span>
       </template>
     </el-table-column>

      <el-table-column align="center" label="活动时间" width="360">
        <template slot-scope="scope">
          <span>{{ scope.row.startTime }} 至 {{ scope.row.endTime }}</span>
        </template>
      </el-table-column>

      <el-table-column class-name="status-col" align="center" label="创建人" width="240">
        <template slot-scope="scope">
          <span>{{ scope.row.creatorName }}</span>
        </template>
      </el-table-column>
      <el-table-column class-name="status-col" align="center" label="活动状态" width="100">
        <template slot-scope="scope">
          <span v-if="scope.row.status == 9">活动草稿</span>
          <span v-else-if="statusFormat(scope.row) == 11">待提交</span>
          <span v-else-if="statusFormat(scope.row) == 12">待审核</span>
          <span v-else-if="statusFormat(scope.row) == 13">未开始</span>
          <span v-else-if="statusFormat(scope.row) == 14">审核未通过</span>
          <span v-else-if="statusFormat(scope.row) == 15">进行中</span>
          <span v-else-if="statusFormat(scope.row) == 16">已过期</span>
          <span v-else-if="statusFormat(scope.row) == 17">已结束</span>
          <span v-else-if="scope.row.status == 7">已关闭</span>
        </template>
      </el-table-column>

     
      <el-table-column align="center" label="创建时间" width="240">
        <template slot-scope="scope">
          <span>{{ scope.row.createTime }}</span>
        </template>
      </el-table-column>
      <el-table-column fixed="right" align="left" label="操作" width="390">
      <template slot-scope="scope">
        <el-button type="text" @click="seeNewTab(scope.row.id)" v-if="scope.row.status != 9"  size="mini" style="">查看</el-button>
        <kt-button type="text" size="mini" v-if="scope.row.status == 7 || statusFormat(scope.row) == 15 || statusFormat(scope.row) == 17" @click="goGroup(scope.row.groupCode)"  label="开团管理"/>
        <kt-button type="text" size="mini" v-if="scope.row.status == 9 || statusFormat(scope.row) == 11 || statusFormat(scope.row) == 14" v-show="scope.row.editFlag" @click="updateBtnShow(scope.row.id)"  label="编辑"/>
        <kt-button type="text" size="mini" v-if="statusFormat(scope.row) == 11 || scope.row.status == 9" v-show="scope.row.editFlag" @click="deleteActivity(scope.row)"  label="删除"/>
        <kt-button type="text" size="mini" v-if="scope.row.status != 9 " @click="copyBtnShow(scope.row.groupCode)" v-show="scope.row.editFlag"  label="复制"/>
        <kt-button type="text" size="mini" v-if="statusFormat(scope.row) == 13 || statusFormat(scope.row) == 15" v-show="scope.row.editFlag" @click="closeActivity(scope.row.id,statusFormat(scope.row.status))"  label="关闭"/>
      </template>
      </el-table-column>
    </el-table>
    <!--分页栏-->
    <div class="toolbar" style="padding:10px;">
      <el-pagination
        layout="total, sizes, prev, pager, next, jumper"
        @current-change="refreshPageRequest"
        :current-page="filters.pageNo"
        :page-size="filters.pageSize"
        :total="totalSize"
        style="float:right;"
        :page-sizes="[10, 20, 30, 40]"
        @size-change="handleSizeChange"
      ></el-pagination>
    </div>
  </div>
</template>

<script>
// import { fetchList } from '@/api/article'
import qs from "qs";
import KtButton from "@/views/Core/KtButton";

export default {
  components: {
    KtButton,
  },
  size: "small",
  align:"center",
  loading:false,
  components: {
    KtButton
  },
  filters: {
    statusFilter(status) {
      const statusMap = {
        published: "success",
        draft: "info",
        deleted: "danger"
      };
      return statusMap[status];
    }
  },
  // 子组件要显式的用 props 选项声明它预期的数
  props: {
    type: {
      type: String,
      default: null
    },
    id: {
      type: String,
      default: null
    },
    groupCode: {
      type: String,
      default: null
    },
    promName: {
      type: String,
      default: null
    },
    creatorNameForSearch: {
      type: String,
      default: null
    },
    startTime: {
      type: String,
      default: null
    },
    endTime: {
      type: String,
      default: null
    },
    channelCodes: {
      type: String,
      default: null
    },
    channelId: {
      type: String,
      default: null
    },
  },
  data() {
    return {
      totalSize: 0,
      // 分页信息
      filters: {
        status: null,
        pageNo: 1,
        pageSize: 10,
        orderBys: [
          {
            f: "create_time",
            s: "desc"
          }
        ]
      },

      loading:false,
      list: [],
      apiList: [],
      size: "small",
      listQuery: {
        page: 1,
        limit: 5,
        type: this.type,
        sort: "+id"
      },
    };
  },
  created() {
    //
    //
    //
    if (this.$route.query.tab != "undefined" && this.$route.query.tab != "") {
      this.filters.status = this.$route.query.tab;
    }
  },
  mounted() {
    //
    //
    //
    //
    //
    //
    //
    //
    this.refreshPageRequest(1);
  },
  methods: {
    /**
     * 状态格式化
     */
    statusFormat(row){
      if(row.status == 1 && new Date().getTime() <= new Date(row.startTime).getTime()){
        //待提交
        return 11;
      }else if(row.status == 2 && new Date().getTime() <= new Date(row.startTime).getTime()){
        //待审核
        return 12;
      }else if(row.status == 11 && new Date().getTime() <= new Date(row.startTime).getTime()){
        //未开始
        return 13;
      }else if(row.status == 4 && new Date().getTime() <= new Date(row.startTime).getTime()){
        //审核未通过
        return 14;
      }else if(row.status == 11 && new Date().getTime() >= new Date(row.startTime).getTime() && new Date().getTime() <= new Date(row.endTime).getTime()){
        //进行中
        return 15;
      }else if((row.status == 1 || row.status ==  2 || row.status == 4) && new Date().getTime() > new Date(row.startTime).getTime()){
        //已过期
        return 16;
      }else if(row.status == 11 && new Date().getTime() > new Date(row.endTime).getTime()){
        //已结束
        return 17;
      }
    },

    tableClick() {

    },
    // 换页刷新
    handleSizeChange: function(pageSize) {
      this.filters.pageNo = 1;
      this.filters.pageSize = pageSize;
      this.setList();
    },
    test(tt) {


    },

    setList: function() {
      //
      this.loading = true;
      // this.$emit('create') // for test

      let this_ = this;
      if (this.filters.status == "0") {
        this.filters.status = null;
      }
      // this.$axios.post("jic-market/patch-groupon-theme/query-page",qs.stringify(this.filters)).then(res => {
      //
      //     if(res.data.code =="0000") {
      //       this_.list = res.data.data.rows;
      //       this_.totalSize = Number(res.data.total);
      //     }
      // });
      this.utils.request.grouponQueryPage(this.filters, function(res) {
        if (res.code == "0000") {
          this_.list = res.data.list;
          this_.totalSize = res.data.totalCount;

        }
      });
      this.loading = false;
      //
    },
    // 换页刷新
    refreshPageRequest: function(pageNum) {
      this.filters.id = this.id;
      this.filters.groupCode = this.groupCode;
      this.filters.promName = this.promName;
      this.filters.creatorNameForSearch = this.creatorNameForSearch;
      this.filters.channelCodes = this.channelCodes;
      this.filters.startTime = this.startTime;
      this.filters.endTime = this.endTime;
      this.filters.channelId = this.channelId;

      this.filters.pageNo = pageNum;
      this.setList();
    },

    // getList() {
    //   this.loading = true
    //   this.$emit('create') // for test
    //   // fetchList(this.listQuery).then(response => {
    //   var key = 'status'+this.listQuery.type;
    //
    //
    //
    //
    //   this.list = this.tableList[key];
    //   this.loading = false
    //   // })
    // },

    //查看
    seeNewTab: function(id) {
      this.$router.push("/GroupDetailPromotion?id=" + `${id}`);
    },
    //复制
    copyBtnShow: function(id) {

      this.$confirm("是否确认复制该活动？", "提示", {
        type: "warning"
      }).then(() => {
        let that = this;
        let param = { promotionId: id };
        this.utils.request.grouponCopy(param, function(res) {
          if (res.code == "0000") {
            that.filters.id = null;
            that.setList();
          }
        });

      })
      .catch(() => {
      });
    },
    //关闭
    closeActivity: function(id,status) {

      let msg = ''
      if(status == 5){
        msg = '该活动正在进行中，确定要关闭它？关闭后不可再次开启。'
      }else{
        msg = '该活动即将进行，确定要关闭它？关闭后不可再次开启。'
      }
      this.$confirm(msg, "提示", {
        type: "warning"
      })
        .then(() => {
          let callback = res => {
            if (res.code == "0000") {
              this.setList();
              this.$message({ message: "活动已关闭 ", type: "success" });
            } else {
              this.$message({
                message: "操作失败, " + res.message,
                type: "error"
              });
            }
            this.loading = false;
          };

          var param = {};
          param.id = id;
          this.utils.request.patchGrouponClose(param, callback);
        })
        .catch(() => {});
    },
    deleteActivity: function(row) {
      var this_ = this;

      this.$confirm("确定要执行删除操作么？删除后不可恢复!", "提示", {
        type: "warning"
      })
        .then(() => {
          let callback = res => {
            if (res.code == "0000") {
              this.$message({ message: "删除成功", type: "success" });
              this.setList();
            } else {
              this.$message({
                message: "操作失败, " + res.message,
                type: "error"
              });
            }
            this.loading = false;
          };

          var param = {};
          param.id = row.id;
          this.utils.request.patchGrouponDelete(param, callback);
        })
        .catch(() => {});
    },
    updateBtnShow: function(id) {
      //编辑拼团活动
      // this.$router.push("/GroupActivityComponents?auth=0&id=" + id);
      this.$router.push("/GroupActivityComponentsNew?auth=0&id=" + id +"&active=1");
    },
    //追加商品
    appendsuperadminProduct: function() {},
    //查看营销报告
    viewMarketingReport: function() {
      this.$router.push("/MarketingReport");
    },
    //查看分析
    viewAnalysi() {
      this.$router.push('/CreateGrouponDetail')
      //
    },
    //二次营销
    SecondSell() {
      //
      this.$emit('SecondSell')
    },
    goGroup(grouponCode){
      this.$router.push("/paje/Market/GrouponStartMgm?grouponCode=" + grouponCode);
    }
  }
};
</script>
<style scoped lang="scss">
  /deep/ button {
    margin-bottom: 10px;
    margin-left: 10px;
  }
</style>

